<include file="Mobile2024:publicHeader"/>
<body>
<include file="Mobile2024:publicHeader2"/>
<!---->
<ul id="accordion" class="accordion">
    <li>
        <div class="link">
            <if condition="( $cidlistlen == 1)">{$cidlist[0]}类<else/>分类</if>
            <span class="icon"></span>
        </div>
        <div class="submenu ">
            <div class="shade"></div>
            <div class="submenu_content" style="height:80%">
                <div class="group">
                    <div class="group_l">
                        <ul>
                            <volist name="category" id="vo" key="k">
                                <li href="javascript:;" data-id="{$vo.id}" id="category_left_menu_{$vo.id}" <if condition="( in_array($vo['id'],$cidlist) )">class="on"</if> >{$vo.cate_sn}-{$vo.cate_name}</li>
    </volist>
</ul>
</div>
<div class="group_r">
    <div class="checkbox">
        <label>
            <if condition="( $cidlistlen gt 1)">
                <input name="checkbox" id="more-cate" value="1" type="checkbox" checked="checked" class="tui-checkbox" >
                <else/>
                <input name="checkbox" id="more-cate" value="1" type="checkbox" class="tui-checkbox" >
            </if>
            勾选多类
        </label>
    </div>
    <div class="group_classify">
        <div class="group_title">
            <h2 id="category_group_type_desc">按产品选择</h2>
            <div class="cut">
                <img src="_STATIC_/mobile2024/img/icon9.png"> <span id="category_group_type" class="category_good">切换为群组</span>
            </div>
        </div>
        <volist name="category" id="vo" key="k">
            <div class="category_group_box" id="category_group_box_{$vo.id}" data-id="{$vo.id}" <if condition="( in_array($vo['id'],$cidlist) )"> style="display:block" </if> >
            <div class="category_group_title" <if condition="( in_array($vo['id'],$cidlist) and $cidlistlen gt 1 )"> style="display:block" </if> id="category_group_title_{$vo.id}">{$vo.cate_sn} {$vo.cate_name} <span class="category_group_box_close" data-id="{$vo.id}">X</span></div>
    <notempty name="vo.similar">
        <ul class="group_list">
            <volist name="vo.similar" id="similar">
                <li class="similar" data-id="{$vo.id}" data-k="{$similar.k}">【{$similar.k}】{$similar.v}</li>
            </volist>
        </ul>
        <div class="group_list_word" <if condition="( in_array($vo['id'],$cidlist) )"> style="display:block" </if> >
        <volist name="vo.word" id="word">
            <span <if condition="( in_array($word['tv'],$wordvlist) )"> class="word bgs" <else/> class="word" </if>  data-id="{$vo.id}" data-k="{$word.k}" data-tv="{$word.tv}">{$word.v}</span>
        </volist>
</div>
</notempty>
</div>
</volist>
</div>
</div>
</div>
<div class="confirm">
    <button onclick="window.location.href='product.html'">重置</button>
    <button class="filtCateSubmit">确定</button>
</div>
</div>
</div>
</li>
<li>
    <div class="link">价格<span class="icon"></span></div>
    <div class="submenu">
        <div class="shade"></div>
        <div class="submenu_content">
            <div class="filtrate">
                <div class="filtrate_price">
                    <div class="extent">
                        <h2>自定义</h2>
                        <label>
                            <input placeholder="最低价" id="ps" type="number" min="0" value="{$ps}">
                            <i>至</i>
                            <input placeholder="最高价" id="pe" type="number" min="0" value="{$pe}">
                        </label>
                    </div>
                    <div class="filtrate_list">
                        <span href="javascript:;" data-id="0" <if condition="($pt eq 0 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >不限</span>
                        <span href="javascript:;" data-id="1" <if condition="($pt eq 1 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >0-3千</span>
                        <span href="javascript:;" data-id="2" <if condition="($pt eq 2 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >3-5千</span>
                        <span href="javascript:;" data-id="3" <if condition="($pt eq 3 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >5-8千</span>
                        <span href="javascript:;" data-id="4" <if condition="($pt eq 4 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >8-1万</span>
                        <span href="javascript:;" data-id="5" <if condition="($pt eq 5 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >1-1.5万</span>
                        <span href="javascript:;" data-id="6" <if condition="($pt eq 6 && empty($ps) && empty($pe))"> class="filtrate_current" </if> >1.5-1.8万</span>
                    </div>
                </div>
            </div>
            <div class="confirm">
                <button class="filtPriceReset" >重置</button>
                <button class="filtPriceSubmit" >确定</button>
            </div>
        </div>
    </div>
</li>
<li>
    <div class="link">
        <notempty name="ntText">类型<else/>类型</notempty>
        <span class="icon"></span>
    </div>
    <div class="submenu">
        <div class="shade"></div>
        <div class="submenu_content">
            <div class="filtrate">
                <div class="filtrate_type">
                    <h2>组合类型</h2>
                    <div class="filtrate_list">
                        <span href="javascript:;" data-id="0" <if condition="( empty($nt) || in_array(0,$nt))"> class="filtrate_current" </if> >不限</span>
                        <span href="javascript:;" data-id="1" <if condition="(in_array(1,$nt))"> class="filtrate_current" </if> >纯中文</span>
                        <span href="javascript:;" data-id="2" <if condition="(in_array(2,$nt))"> class="filtrate_current" </if> >纯英文</span>
                        <span href="javascript:;" data-id="3" <if condition="(in_array(3,$nt))"> class="filtrate_current" </if> >中文+英文</span>
                        <span href="javascript:;" data-id="4" <if condition="(in_array(4,$nt))"> class="filtrate_current" </if> >纯数字</span>
                        <span href="javascript:;" data-id="5" <if condition="(in_array(5,$nt))"> class="filtrate_current" </if> >中文+数字</span>
                        <span href="javascript:;" data-id="6" <if condition="(in_array(6,$nt))"> class="filtrate_current" </if> >英文+数字</span>
                        <span href="javascript:;" data-id="8" <if condition="(in_array(8,$nt))"> class="filtrate_current" </if> >纯图形</span>
                    </div>
                </div>
            </div>
            <div class="confirm">
                <button class="filtNameTypeReset">重置</button>
                <button class="filtNameTypeSubmit">确定</button>
            </div>
        </div>
    </div>
</li>
<li>
    <div class="link">
        <notempty name="ns">字数<else/>字数</notempty>
        <span class="icon"></span>
    </div>
    <div class="submenu">
        <div class="shade"></div>
        <div class="submenu_content">
            <div class="filtrate">
                <div class="filtrate_figure">
                    <h2>商标字数</h2>
                    <div class="filtrate_list">
                        <span href="javascript:;" data-id="0" <if condition="( empty($ns) || in_array(0,$ns))"> class="filtrate_current" </if> >不限</span>
                        <span href="javascript:;" data-id="1" <if condition="(in_array(1,$ns))"> class="filtrate_current" </if> >1个字</span>
                        <span href="javascript:;" data-id="2" <if condition="(in_array(2,$ns))"> class="filtrate_current" </if> >2个字</span>
                        <span href="javascript:;" data-id="3" <if condition="(in_array(3,$ns))"> class="filtrate_current" </if> >3个字</span>
                        <span href="javascript:;" data-id="4" <if condition="(in_array(4,$ns))"> class="filtrate_current" </if> >4个字</span>
                        <span href="javascript:;" data-id="5" <if condition="(in_array(5,$ns))"> class="filtrate_current" </if> >5个字</span>
                        <span href="javascript:;" data-id="6" <if condition="(in_array(6,$ns))"> class="filtrate_current" </if> >6个字</span>
                        <span href="javascript:;" data-id="7" <if condition="(in_array(7,$ns))"> class="filtrate_current" </if> >7个字</span>
                        <span href="javascript:;" data-id="8" <if condition="(in_array(8,$ns))"> class="filtrate_current" </if> >8个字</span>
                        <span href="javascript:;" data-id="9" <if condition="(in_array(9,$ns))"> class="filtrate_current" </if> >9个字</span>
                    </div>
                </div>
            </div>
            <div class="confirm">
                <button class="filtNameLenReset">重置</button>
                <button class="filtNameLenSubmit">确定</button>
            </div>
        </div>
    </div>
</li>
<li>
    <div class="link">综合排序<span class="icon"></span></div>
    <div class="submenu">
        <div class="shade"></div>
        <div class="submenu_content">
            <div class="filtrate">
                <div class="filtrate_sort">
                    <h2>排序规则</h2>
                    <div class="filtrate_list">
                        <span href="javascript:;" data-id="0"  <if condition="($order eq 0)"> class="filtrate_current" </if> >不限</span>
                        <span href="javascript:;" data-id="1"  <if condition="($order eq 1)"> class="filtrate_current" </if> >价格由低到高</span>
                    </div>
                </div>
            </div>
            <div class="confirm">
                <button class="orderbyReset">重置</button>
                <button class="orderbySubmit">确定</button>
            </div>
        </div>
    </div>
</li>
</ul>
<!--排序-->
<!---->
<div class="product_list">
    <volist name="trademarks.data.list" id="vo" key="k">
        <div class="list_item trademark" data-id="{$vo.id}">
            <img src="{$vo.thumb_image}" />
            <div class="name">{$vo.lei}类-{$vo.name}</div>
            <div class="minterm">
                <volist name="vo.goods_service" id="good">
                    <span>{$good}</span>
                </volist>
            </div>
            <!-- <div class="price"><i>￥</i>{$vo.price}<span> (不含500转让费)</span></div> -->
        </div>
    </volist>
</div>
<!--分页-->
<div class="page">
    <div>
        <span>第</span>
        <input type="number" id="page" min="{$page}" max="{$totalPage}" value="{$page}">
        <span>/{$totalPage}页</span>
    </div>
    <div>
        <button id="prePage" <if condition="($page elt 1)"> class="grey" </if> >上一页</button>
        <button id="nextPage" <if condition="($page egt $totalPage)"> class="grey" </if> >下一页</button>
    </div>
</div>
<!--footer-->
<div style="height: 1.38rem;"></div>
<include file="Mobile2024:publicFooter"/>
<!--客服-->
<include file="Mobile2024:publicKefu"/>
<!--产品详情弹窗-->
<include file="Mobile2024:productDetail"/>
<script>
    $(function() {
        var baseApiUrl = "product.html";
        var currentPage = parseInt("{$page}")
        var totalPage = parseInt("{$totalPage}")
        $(".filtrate_list span").mouseover(function() {
            var labelClass = $(this).parent("div").parent("div").attr("class");
            if( labelClass == 'filtrate_type' || labelClass == 'filtrate_figure' ){
                if( $(this).hasClass("filtrate_current") ){
                    $(this).removeClass('filtrate_current');
                }else{
                    $(this).addClass('filtrate_current');
                    var buxianid = $(this).attr("data-id");
                    if( buxianid != 'undefined' && isNumber(buxianid) && buxianid == 0 ){
                        $(this).addClass('filtrate_current').siblings().removeClass('filtrate_current');
                    }else{
                        $(this).siblings().filter("[data-id='0']").removeClass("filtrate_current");
                    }
                }
            }else{
                $(this).addClass('filtrate_current').siblings().removeClass('filtrate_current');
            }
        });
        //自定义价格则取消区间间隔筛选
        $("#ps, #pe").click(function (){
            $(".filtrate_price .filtrate_list span").removeClass("filtrate_current");
        });
        //区间价格则取消自定义价格筛选
        $(".filtrate_price .filtrate_list span").click(function (){
            $("#ps").val("");
            $("#pe").val("");
        });
        //确定-分类搜索
        $(".filtCateSubmit").click(function (){
            let leis = [];
            let teams = [];
            let wordv = [];
            $(".category_group_box").filter(function() {
                return $(this).css('display') === 'block';
            }).each(function() {
                var cid = $(this).attr("data-id");
                if( !leis.includes(cid) ){
                    leis.push(cid);
                }
                //群组
                $("#category_group_box_" + cid + " .group_list").filter(function() {
                    return $(this).css('display') === 'block';
                }).each(function() {
                    $("#category_group_box_" + cid + " .group_list .similar").filter(function() {
                        return $(this).hasClass("bgs");
                    }).each(function() {
                        var datak = $(this).attr("data-k");
                        if( !teams.includes(datak) ) {
                            teams.push(datak);
                        }
                    });
                });
                //产品
                $("#category_group_box_" + cid + " .group_list_word").filter(function() {
                    return $(this).css('display') === 'block';
                }).each(function() {
                    $("#category_group_box_" + cid + " .group_list_word .word").filter(function() {
                        return $(this).hasClass("bgs");
                    }).each(function() {
                        var datak = $(this).attr("data-k");
                        var datatv = $(this).attr("data-tv");
                        if( !teams.includes(datak) ) {
                            teams.push(datak);
                        }
                        if( !wordv.includes(datatv) ) {
                            wordv.push(datatv);
                        }
                    });
                });
            });
            var url = window.location.href;
            var params = getUrlParams(url);
            if (leis.length > 0) {
                params['leis'] = leis.join("-");
                delete params.cid;
            }else{
                delete params.leis;
            }
            if (teams.length > 0) {
                params['teams'] = teams.join("-");
            }else{
                delete params.teams;
            }
            if (wordv.length > 0) {
                params['wordv'] = wordv.join("-");
            }else{
                delete params.wordv;
            }
            //从第一页开始
            if( params.hasOwnProperty("page") ){
                delete params.page;
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
        //重置-价格筛选条件
        $(".filtPriceReset").click(function (){
            $(".filtrate_price #ps").val("");
            $(".filtrate_price #pe").val("");
            $(".filtrate_price .filtrate_list span").removeClass("filtrate_current");
            $(".filtrate_price .filtrate_list span").filter("[data-id='0']").addClass("filtrate_current");
        });
        //确定-价格筛选条件
        $(".filtPriceSubmit").click(function (){
            var ps = $(".filtrate_price #ps").val();
            var pe = $(".filtrate_price #pe").val();
            var pt = "";
            $(".filtrate_price .filtrate_list span").each(function (){
                if( $(this).attr("class") == "filtrate_current" ){
                    pt = $(this).attr("data-id");
                }
            });
            var url = window.location.href;
            var params = getUrlParams(url);
            if( isNumber(ps) ){
                params['ps'] = ps;
            }else{
                delete params.ps;
            }
            if( isNumber(pe) ){
                params['pe'] = pe;
            }else{
                delete params.pe;
            }
            if( isNumber(pt) ){
                params['pt'] = pt;
            }else{
                delete params.pt;
            }
            //从第一页开始
            if( params.hasOwnProperty("page") ){
                delete params.page;
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
        //重置-组合类型筛选条件
        $(".filtNameTypeReset").click(function (){
            $(".filtrate_type .filtrate_list span").removeClass("filtrate_current");
            $(".filtrate_type .filtrate_list span").filter("[data-id='0']").addClass("filtrate_current");
        });
        //确定-组合类型筛选条件
        $(".filtNameTypeSubmit").click(function (){
            let ntArr = [];
            $(".filtrate_type .filtrate_list span").each(function (){
                if( $(this).attr("class") == "filtrate_current" ){
                    var nt = $(this).attr("data-id");
                    if( !ntArr.includes(nt) ){
                        ntArr.push(nt);
                    }
                }
            });
            var url = window.location.href;
            var params = getUrlParams(url);
            if (ntArr.length > 0) {
                params['nt'] = ntArr.join("-");
            }else{
                delete params.nt;
            }
            //从第一页开始
            if( params.hasOwnProperty("page") ){
                delete params.page;
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
        //重置-名称长度
        $(".filtNameLenReset").click(function (){
            $(".filtrate_figure .filtrate_list span").removeClass("filtrate_current");
            $(".filtrate_figure .filtrate_list span").filter("[data-id='0']").addClass("filtrate_current");
        });
        //确定-名称长度
        $(".filtNameLenSubmit").click(function (){
            let nsArr = [];
            $(".filtrate_figure .filtrate_list span").each(function (){
                if( $(this).attr("class") == "filtrate_current" ){
                    var ns = $(this).attr("data-id");
                    if( !nsArr.includes(ns) ){
                        nsArr.push(ns);
                    }
                }
            });
            var url = window.location.href;
            var params = getUrlParams(url);
            if (nsArr.length > 0) {
                params['ns'] = nsArr.join("-");
            }else{
                delete params.ns;
            }
            //从第一页开始
            if( params.hasOwnProperty("page") ){
                delete params.page;
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
        //重置-排序规则
        $(".orderbyReset").click(function (){
            $(".filtrate_sort .filtrate_list span").removeClass("filtrate_current");
            $(".filtrate_sort .filtrate_list span").filter("[data-id='0']").addClass("filtrate_current");
        });
        //确定-排序规则
        $(".orderbySubmit").click(function (){
            var order = 0;
            $(".filtrate_sort .filtrate_list span").each(function (){
                if( $(this).attr("class") == "filtrate_current" ){
                    order = $(this).attr("data-id");
                }
            });
            var url = window.location.href;
            var params = getUrlParams(url);
            if( isNumber(order) ){
                params['order'] = order;
            }
            //从第一页开始
            if( params.hasOwnProperty("page") ){
                delete params.page;
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
        //自定义页码
        $("#page").on('keydown', function (event){
            //当前页回车
            if( event.keyCode == 13 ){
                var page = $("#page").val();
                if( page > 0 && page <= totalPage ){
                    var url = window.location.href;
                    var params = getUrlParams(url);
                    if( params.hasOwnProperty("page") ){
                        params['page'] = page;
                    }else{
                        params['page'] = page;
                    }
                    window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
                }
            }
        });
        //点击上一页
        $("#prePage").click(function (){
            if( currentPage == 1 ){
                return;
            }
            var url = window.location.href;
            var params = getUrlParams(url);
            if( params.hasOwnProperty("page") ){
                params['page'] = (currentPage - 1 );
            }else{
                params['page'] = (currentPage - 1 );
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
        //点击下一页
        $("#nextPage").click(function (){
            if( currentPage == totalPage ){
                return;
            }
            var url = window.location.href;
            var params = getUrlParams(url);
            if( params.hasOwnProperty("page") ){
                params['page'] = (currentPage + 1 );
            }else{
                params['page'] = (currentPage + 1 );
            }
            window.location.href = baseApiUrl + "?" + new URLSearchParams(params).toString();
        });
    });
</script>
</body>
</html>